// pages/punchCardCircle/punchCardCircle.js
import Time from "../../utils/time"

const Player = require("../../utils/player"),

    audioList = []
Page({

    /**
     * 页面的初始数据
     */
    data: {
        standard:true,
        punchCardContent: {
            imgUrl: 'http://www.haopic.me/wp-content/uploads/2016/10/20161013124719335.jpg',
            name: '五月绿舍离身体整理健身打卡',
            latelyAvatar: ['http://www.haopic.me/wp-content/uploads/2016/10/20161013124719335.jpg',
                'http://www.haopic.me/wp-content/uploads/2016/10/20161013124719335.jpg',
                'http://www.haopic.me/wp-content/uploads/2016/10/20161013124719335.jpg',],
            latelyName: '苦涩涩涩',
            addNumber: '663',
            punchNumber: '3622',
            content: " 打卡内容打卡内容打卡内容打卡内容容打卡内容容打卡内遵循HTML5标准的2D、3D引擎，解决了HTML5性能问题及碎片化问题，灵活地满足开发者开发2D或3D游戏的需求，\n" +
            "并有着极强的跨平台运行能力。容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容打卡内容"
        },
        log: [
            {
                avatar: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                sex: true, // true 男 false 女
                name: "ahhhh",
                startDate: '2',
                dateNumber: '20',
                // 文字 图片 声音 视频
                content: {
                    character: '今天天气很好 我很开心',
                    photo: [
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg"
                    ],
                    audio: "",
                    movie: "",
                    // 参与打卡 图片 名字 加入人数
                    joinRole: {
                        photo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        name: '英语早操',
                        joinNumbr: '1024'
                    }
                },
                // 互动 关注 红心 评论
                interaction: {
                    isAttention: true,
                    isHeart: false,
                    heartNumber: [
                        {
                            name: "wen",
                            she: '不问归期',
                            content: [
                                {
                                    makeName: 'wen',
                                    replyName: '不问归期',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                            ],
                        },
                        {
                            name: "wen3",
                            she: '苦涩3',
                            content: [
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                                {
                                    makeName: '发言',
                                    replyName: '打卡者',
                                    content: '真的很不错诶'
                                },
                            ],
                        }
                    ],
                    // 评论内容
                    comment: [],
                    // 是否缩进
                    isComment: false
                }
            },
            {
                avatar: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                sex: false, // false 男 true 女
                name: "ahhhh",
                startDate: '2',
                dateNumber: '20',
                // 文字 图片 声音 视频
                content: {
                    character: '今天天气很好 我很开心',
                    photo: [
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        // "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        // "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg"

                    ],
                    audio: "",
                    movie: "",
                    // 参与打卡 图片 名字 加入人数
                    joinRole: {
                        photo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        name: '英语早操',
                        joinNumbr: '1024'
                    }
                },
                // 互动 关注 红心 评论
                interaction: {
                    isAttention: false,
                    isHeart: false,
                    heartNumber: [],
                    // 评论内容
                    comment: [],
                    // 是否缩进
                    isComment: false
                }
            },
            {
                avatar: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                sex: false, // false 男 true 女
                name: "ahhhh",
                startDate: '2',
                dateNumber: '20',
                // 文字 图片 声音 视频
                content: {
                    character: '今天天气很好 我很开心',
                    photo: [
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        // "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        // "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg"

                    ],
                    audio: {
                        url: "http://ip.h5.rc01.sycdn.kuwo.cn/resource/n3/96/56/2310568805.mp3",
                        startDate: '00:00',
                        endDate: '03:00'
                    },
                    movie: "",
                    // 参与打卡 图片 名字 加入人数
                    joinRole: {
                        photo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        name: '英语早操',
                        joinNumbr: '1024'
                    }
                },
                // 互动 关注 红心 评论
                interaction: {
                    isAttention: false,
                    isHeart: true,
                    // 评论内容
                    comment: [],
                    // 是否缩进
                    isComment: false
                }
            },
            {
                avatar: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                sex: false, // false 男 true 女
                name: "ahhhh",
                startDate: '2',
                dateNumber: '20',
                // 文字 图片 声音 视频
                content: {
                    character: '今天天气很好 我很开心',
                    photo: [
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                    ],
                    audio: {
                        url: "http://ar.h5.ra01.sycdn.kuwo.cn/resource/n2/320/21/79/2129722879.mp3",
                        startDate: '00:00',
                        endDate: '03:00'
                    },
                    movie: "",
                    // 参与打卡 图片 名字 加入人数
                    joinRole: {
                        photo: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1528128688402&di=0ab35793c7e297479e56ff841b08b7af&imgtype=0&src=http%3A%2F%2Fp5.yokacdn.com%2Fpic%2Fcr%2F2014%2F0821%2F1286020305.jpg",
                        name: '英语早操',
                        joinNumbr: '1024'
                    }
                },
                // 互动 关注 红心 评论
                interaction: {
                    isAttention: false,
                    isHeart: false,
                    // 评论内容
                    comment: [],
                    // 是否缩进
                    isComment: false
                }
            },

        ],
        //    效果控制
        control: {
            audio: {
                player: {},
                id: "",
                isPlayer: true,
                isPause: false,
                startDate: '00:00',
                progress: "",
                activeProgress: {},
                aniProgress: {},
                loadSucc: false
            },
            movie: {}
        },
        cardHistory: [
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            },
            {
                name: '六月绿色打卡',
                cardDay:23,
                topList:65
            }
        ],
        userInfo: {
            name: "苦涩"
        }
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        this.AudioProgress()
        this.initAudio()
    },
    // 初始化录音
    initAudio: function () {
        const that = this,
            control = this.data.control,
            player = new Player(),
            logs = that.data.log;
        let audioData = []

        console.log(player)
        for (let i = 0; i < logs.length; i++) {
            if (logs[i].content.audio != "") {
                audioList.push({
                    id: "aa",
                    dataUrl: logs[i].content.audio.url,
                    title: i,
                    index: i,
                })
            }
        }
        player.list.create(audioList)
        control.audio.player = player
        that.setData({
            control: control
        })
        player.event.on("play ", function (data) {
            console.log("ahh")
        })
    },
//    录音播放实例
    createAudioPlay: function (e) {
        const that = this,
            control = that.data.control,
            time = new Time(),
            logs = that.data.log,
            isPlayer = control.audio.isPlayer,
            isPause = control.audio.isPlayer,
            url = e.currentTarget.dataset.bind,
            audio = logs[url].content.audio,
            player = control.audio.player;
        control.audio.id = url
        console.log(url)
        console.log(audioList)
        let index;
        for (let j = 0; j < audioList.length; j++) {
            if (audioList[j].index == url) {
                index = audioList[j]._id
            }
        }

        //      判断是否点击当前录音
        if (player.list.current() !== null && player.list.current().index != url) {
            //        点击别的录音
            that.audioProgressAnimation(0, control.audio.progress, "00:00")
            player.stop()
            if (!player.isPlaying()) {
                console.log("开始播放")
                player.invoke(index)
                control.audio.isPlayer = false
                that.setData({
                    control: control
                })
            }

            player.event.on('timeupdate', function (data) {
                console.log("开始监听")
                if (data.status == 1) {
                    let startDate = time.secondConvertMinute(data.currentPosition)
                    let actWidth = parseFloat(data.currentPosition / data.duration)
                    if ((data.duration - data.currentPosition) == 0) {
                        console.log("audio end")
                        player.stop()
                        control.audio.isPlayer = true
                    }
                    else {
                        that.audioProgressAnimation(actWidth, control.audio.progress, startDate)
                    }
                }
            })
        }
        else {
            player.event.on('timeupdate', function (data) {
                console.log("开始监听")
                if (data.status == 1) {
                    let startDate = time.secondConvertMinute(data.currentPosition)
                    let actWidth = parseFloat(data.currentPosition / data.duration)
                    if ((data.duration - data.currentPosition) == 0) {
                        console.log("audio end")
                        player.stop()
                        control.audio.isPlayer = true
                    }
                    else {
                        that.audioProgressAnimation(actWidth, control.audio.progress, startDate)
                    }
                }
            })
            //       点击当当前的录音
            console.log("ahhh")
            // 是否播放
            if (isPlayer) {
                console.log("创建播放")
                if (player.isPaused()) {
                    console.log("继续播放")
                    player.resume()
                }
                else {
                    if (!player.isPlaying()) {
                        console.log("开始播放")
                        player.invoke(index)
                    }
                }
                control.audio.isPlayer = !isPlayer
                that.setData({
                    control: control
                })
            } else {
                if (!player.isPaused()) {
                    player.pause()
                }
                control.audio.isPlayer = !isPlayer
                that.setData({
                    control: control
                })
            }

        }

    },
//    录音播放进度条
    AudioProgress: function () {
        const that = this,
            control = that.data.control;
        let systemInfo = {}
        wx.getSystemInfo({
            success: res => {
                systemInfo = res
            }
        })
        control.audio.progress = systemInfo.screenWidth * 0.3
        this.setData({
            control: control
        })
    },
//    录音播放进度条动画
    audioProgressAnimation: function (activeProgress, progresWidth, startDate) {
        const that = this,
            control = that.data.control,
            activePro = wx.createAnimation({}),
            aniPro = wx.createAnimation({});
        //  根据歌曲播放百分比 获取active长度
        const width = progresWidth * activeProgress

        activePro.width(width).step()
        aniPro.width(progresWidth - width).step

        control.audio.activeProgress = activePro.export()
        control.audio.aniProgress = aniPro.export()
        control.audio.startDate = startDate
        that.setData({
            control: control
        })


    },
    onShareAppMessage: function () {
        return {
            title: '测试分享',
            path: 'pages/index/index'
        }
    }
})